const ACTION_RESOLVER = {
  // Input field types
  "Data": {
    onChange: "write_draft",
    onBlur: "validate"
  },
  "Text": {
    onChange: "write_draft",
    onBlur: "validate"
  },
  "Int": {
    onChange: "write_draft_coerce",
    onBlur: "validate_numeric"
  },
  "Float": {
    onChange: "write_draft_coerce",
    onBlur: "validate_numeric"
  },
  "Currency": {
    onChange: "write_draft_coerce",
    onBlur: "validate_numeric"
  },
  
  // Selection types
  "Select": {
    onChange: "write_draft",
    onBlur: "validate_options"
  },
  "Link": {
    onChange: "write_draft",
    onBlur: "validate_link"
  },
  "Check": {
    onChange: "write_draft"
  },
  
  // Date types
  "Date": {
    onChange: "write_draft_coerce",
    onBlur: "validate_date"
  },
  "Datetime": {
    onChange: "write_draft_coerce",
    onBlur: "validate_datetime"
  },
  
  // Virtual button type
  "Button": {
    onClick: (fieldname, run) => {
      // Map button fieldname → workflow action
      return run.controller.triggerWorkflowAction(fieldname, run);
    }
  }
};

// Universal event handler
handleFieldEvent(run, fieldname, value, eventType) {
  const field = run.target.schema.fields[fieldname];
  const fieldtype = field?.fieldtype || "Data";
  
  // 1️⃣ Get action from resolver
  const actionConfig = ACTION_RESOLVER[fieldtype]?.[eventType];
  if (!actionConfig) return; // No action defined for this event
  
  // 2️⃣ Check workflow + permissions
  const workflow = run.doc.workflow;
  const state = run.doc.state;
  const allowed = this.checkAllowedAction(workflow, state, fieldname, eventType);
  if (!allowed) {
    console.warn(`Action ${eventType} not allowed for ${fieldname} in state ${state}`);
    return;
  }
  
  // 3️⃣ Execute action
  if (typeof actionConfig === "function") {
    // Button or custom handler
    actionConfig(fieldname, run);
  } else {
    // Standard pipeline action
    this.executeAction(actionConfig, run, fieldname, value);
  }
  
  // 4️⃣ Check autosave rules
  if (this.shouldAutoSave(run, state)) {
    this.debouncedSave(run);
  }
  
  // 5️⃣ Trigger re-render
  this.updateUI(run);
}

// Workflow action handler (for buttons)
triggerWorkflowAction(actionName, run) {
  const workflow = run.doc.workflow;
  const currentState = run.doc.state;
  
  // Check if transition is allowed
  const transition = workflow.transitions.find(
    t => t.from === currentState && t.action === actionName
  );
  
  if (!transition) {
    console.warn(`Transition ${actionName} not allowed from state ${currentState}`);
    return;
  }
  
  // Execute transition
  run.doc.state = transition.to;
  
  // Update docstatus if needed
  if (actionName === "submit") run.doc.docstatus = 1;
  if (actionName === "cancel") run.doc.docstatus = 2;
  
  // Trigger side effects
  this.triggerHooks(run, actionName);
  
  // Maybe autosave
  if (this.shouldAutoSave(run, transition.to)) {
    this.save(run);
  }
}
```

---

## 4️⃣ **Key Design Principles**

✅ **Uniform Event Flow**: All UI events (inputs, selects, buttons) flow through `handleFieldEvent()`  
✅ **Config-Driven Actions**: `ACTION_RESOLVER` maps fieldtype + event → pipeline action  
✅ **Workflow-Driven Permissions**: Every action checks `workflow + state` before execution  
✅ **No Artificial Fields**: Buttons are virtual events; they don't write boolean values to `run.input`  
✅ **Hidden State Field**: `doc.state` (hidden from UI) drives all workflow logic  
✅ **Decoupled UI**: UI only emits events; controller interprets them and updates document

---

## 5️⃣ **Example Flows**

### Input field onChange:
```
User types in "customer_name" field
  → UI emits: {fieldname: "customer_name", value: "Acme Corp", eventType: "onChange"}
  → Controller: ACTION_RESOLVER["Data"]["onChange"] = "write_draft"
  → Execute: merge "Acme Corp" into run.input["customer_name"]
  → Check autosave rules → maybe trigger debounced save
  → UI re-renders with updated value
```

### Button onClick:
```
User clicks "Submit" button
  → UI emits: {fieldname: "submit", eventType: "onClick"}
  → Controller: ACTION_RESOLVER["Button"]["onClick"](fieldname, run)
  → triggerWorkflowAction("submit", run)
  → Check workflow: transition from "Draft" → "Submitted" allowed?
  → Update: doc.state = "Submitted", docstatus = 1
  → Trigger hooks, maybe autosave
  → UI re-renders: buttons change, fields become read-only, badge updates

// Universal pipeline entry point
handleFieldEvent(run, fieldname, value, eventType) {
  // ❓ What do we write for a button click?
  run.input[fieldname] = ???  // true? timestamp? action name?
}

// Button click
onClick(actionName) {
  run.input._action = actionName;  // "submit", "cancel", "save", etc.
  controller.handleFieldEvent(run, "_action", actionName, "onClick");
}

// Controller pipeline
handleFieldEvent(run, fieldname, value, eventType) {
  // All events write to run.input first
  run.input[fieldname] = value;
  
  // Then resolve what to do with it
  if (fieldname === "_action") {
    // This is a workflow action trigger
    this.triggerWorkflowAction(value, run);
    delete run.input._action;  // Clean up after processing
  } else {
    // Regular field update
    const actionName = ACTION_RESOLVER[fieldtype]?.[eventType];
    this.executeAction(actionName, run, fieldname, value);
  }
}
```

**Advantages:**
- ✅ Everything flows through `run.input` uniformly
- ✅ Single entry point for all events
- ✅ Action name is explicit and debuggable
- ✅ Clean separation: `_action` is transient, regular fields persist

**Flow:**
```
Button "Submit" clicked
  → run.input._action = "submit"
  → Controller sees _action field
  → Triggers workflow action
  → Updates doc.state
  → Deletes run.input._action
  → UI re-renders

// Button click
onClick(fieldname) {
  run.input[fieldname] = Date.now();  // or new Date().toISOString()
  controller.handleFieldEvent(run, fieldname, Date.now(), "onClick");
}

// Controller
handleFieldEvent(run, fieldname, value, eventType) {
  run.input[fieldname] = value;
  
  const field = run.target.schema.fields[fieldname];
  
  if (field?.fieldtype === "Button") {
    // Value is timestamp of click
    const actionName = fieldname;  // or field.action
    this.triggerWorkflowAction(actionName, run);
    delete run.input[fieldname];  // Clean up
  } else {
    // Regular field processing
    // ...
  }
}

// Schema separation
run.input = {}    // Data fields only
run.events = []   // Event log (buttons, triggers)

// Button click
onClick(actionName) {
  run.events.push({
    type: "workflow_action",
    action: actionName,
    timestamp: Date.now()
  });
  controller.processEvents(run);
}

// Controller
handleFieldEvent(run, fieldname, value, eventType) {
  const field = run.target.schema.fields[fieldname];
  
  if (field?.fieldtype === "Button") {
    run.events.push({
      type: "workflow_action",
      action: fieldname,
      timestamp: Date.now()
    });
  } else {
    run.input[fieldname] = value;
  }
  
  this.processPipeline(run);
}

processPipeline(run) {
  // Process input fields
  for (let [fieldname, value] of Object.entries(run.input)) {
    this.executeFieldAction(fieldname, value, run);
  }
  
  // Process events
  for (let event of run.events) {
    if (event.type === "workflow_action") {
      this.triggerWorkflowAction(event.action, run);
    }
  }
  
  run.events = [];  // Clear after processing
}

// Complete universal pipeline
class Controller {
  handleFieldEvent(run, fieldname, value, eventType) {
    // 1️⃣ Write to run.input (universal entry point)
    run.input[fieldname] = value;
    
    // 2️⃣ Check workflow permissions
    const allowed = this.checkAllowed(run, fieldname, eventType);
    if (!allowed) {
      delete run.input[fieldname];
      return;
    }
    
    // 3️⃣ Route based on field type
    if (fieldname === "_action") {
      // Workflow action trigger
      this.triggerWorkflowAction(value, run);
      delete run.input._action;  // Transient
    } else {
      // Regular field update
      const field = run.target.schema.fields[fieldname];
      const actionName = ACTION_RESOLVER[field.fieldtype]?.[eventType];
      this.executeAction(actionName, run, fieldname, value);
    }
    
    // 4️⃣ Check autosave
    if (this.shouldAutoSave(run)) {
      this.debouncedSave(run);
    }
    
    // 5️⃣ Re-render
    this.updateUI(run);
  }
}

// Usage
<Button onClick={() => {
  run.input._action = "submit";
  controller.handleFieldEvent(run, "_action", "submit", "onClick");
}}>
  Submit
</Button>

<Input onChange={(e) => {
  controller.handleFieldEvent(run, "customer_name", e.target.value, "onChange");
}} />

run.input._action = "submit"  // Button click
run.input.customer_name = "Acme"  // Input change

handleFieldEvent(run, fieldname, value, eventType = null) {
  // Detect mode
  const isUIEvent = eventType !== null;
  const isProgrammatic = eventType === null;
  
  // 1️⃣ Universal entry: write to run.input
  run.input[fieldname] = value;
  
  // 2️⃣ Check permissions (same for both modes)
  const allowed = this.checkAllowed(run, fieldname, eventType);
  if (!allowed) {
    delete run.input[fieldname];
    if (isUIEvent) this.showPermissionError(run, fieldname);
    return;
  }
  
  // 3️⃣ Route based on field type
  if (fieldname === "_action" || this.isWorkflowAction(fieldname)) {
    // Workflow action (button or programmatic)
    this.triggerWorkflowAction(value, run, isUIEvent);
    delete run.input[fieldname];  // Transient
  } else {
    // Regular field update
    const field = run.target.schema.fields[fieldname];
    const actionName = this.resolveAction(field, eventType, isProgrammatic);
    this.executeAction(actionName, run, fieldname, value);
  }
  
  // 4️⃣ Autosave (only for UI events with debouncing)
  if (isUIEvent && this.shouldAutoSave(run)) {
    this.debouncedSave(run);
  } else if (isProgrammatic && this.shouldAutoSave(run)) {
    this.save(run);  // No debouncing for programmatic calls
  }
  
  // 5️⃣ UI update (only for UI events)
  if (isUIEvent) {
    this.updateUI(run);
  }
}

class Controller {
  // Universal entry point
  handleFieldEvent(run, fieldname, value, eventType = null) {
    const isUIEvent = eventType !== null;
    
    // ... unified pipeline logic ...
    
    // Mode-specific behavior
    if (isUIEvent) {
      this.debouncedSave(run);
      this.updateUI(run);
    } else {
      this.save(run);  // Direct save, no debounce
    }
  }
  
  // Helper for workflow actions
  isWorkflowAction(fieldname) {
    return fieldname === "_action" || 
           this.workflowActions.includes(fieldname);
  }
}

// UI mode
<Button onClick={() => 
  controller.handleFieldEvent(run, "_action", "submit", "onClick")
}>Submit</Button>

<Input onChange={(e) => 
  controller.handleFieldEvent(run, "customer_name", e.target.value, "onChange")
} />

// Programmatic mode
controller.handleFieldEvent(run, "submit", "submit", null);
controller.handleFieldEvent(run, "customer_name", "Acme Corp", null);

class Controller {
  // UI events
  handleUIEvent(run, fieldname, value, eventType) {
    return this.handleFieldEvent(run, fieldname, value, eventType, { isUI: true });
  }
  
  // Programmatic updates
  setField(run, fieldname, value) {
    return this.handleFieldEvent(run, fieldname, value, null, { isUI: false });
  }
  
  // Programmatic workflow actions
  executeAction(run, actionName) {
    return this.handleFieldEvent(run, "_action", actionName, null, { isUI: false });
  }
  
  // Internal universal handler
  handleFieldEvent(run, fieldname, value, eventType, { isUI }) {
    run.input[fieldname] = value;
    
    // ... unified pipeline logic ...
    
    if (isUI) {
      this.debouncedSave(run);
      this.updateUI(run);
    } else {
      this.save(run);
    }
  }
}

// UI mode
controller.handleUIEvent(run, "_action", "submit", "onClick");
controller.handleUIEvent(run, "customer_name", "Acme", "onChange");

// Programmatic mode
controller.setField(run, "customer_name", "Acme Corp");
controller.executeAction(run, "submit");

class Controller {
  handleFieldEvent(run, fieldname, value, eventType = null) {
    return new FieldEventHandler(this, run, fieldname, value, eventType);
  }
}

class FieldEventHandler {
  constructor(controller, run, fieldname, value, eventType) {
    this.controller = controller;
    this.run = run;
    this.fieldname = fieldname;
    this.value = value;
    this.eventType = eventType;
    this.isUI = eventType !== null;
  }
  
  async execute() {
    // Write to input
    this.run.input[this.fieldname] = this.value;
    
    // Check permissions
    if (!this.checkAllowed()) return;
    
    // Route action
    if (this.isWorkflowAction()) {
      await this.triggerWorkflow();
    } else {
      await this.updateField();
    }
    
    // Post-processing
    if (this.isUI) {
      this.controller.debouncedSave(this.run);
      this.controller.updateUI(this.run);
    } else {
      await this.controller.save(this.run);
    }
  }
  
  // Helpers
  isWorkflowAction() {
    return this.fieldname === "_action" || 
           this.controller.workflowActions.includes(this.fieldname);
  }
  
  checkAllowed() {
    return this.controller.checkAllowed(
      this.run, 
      this.fieldname, 
      this.eventType
    );
  }
}

// UI mode
await controller.handleFieldEvent(run, "_action", "submit", "onClick").execute();

// Programmatic mode
await controller.handleFieldEvent(run, "submit", "submit", null).execute();

class Controller {
  handleFieldEvent(run, fieldname, value, eventType = null) {
    const isUIMode = eventType !== null;
    
    // 1️⃣ Universal input handling
    run.input[fieldname] = value;
    
    // 2️⃣ Permission check
    const allowed = this.checkAllowed(run, fieldname, eventType);
    if (!allowed) {
      delete run.input[fieldname];
      if (isUIMode) this.showError(run, "Permission denied");
      return false;
    }
    
    // 3️⃣ Route to appropriate handler
    if (fieldname === "_action") {
      // Workflow action
      this.triggerWorkflowAction(value, run);
      delete run.input._action;
    } else {
      // Field update
      const field = run.target.schema.fields[fieldname];
      const action = this.resolveAction(field, eventType);
      this.executeAction(action, run, fieldname, value);
    }
    
    // 4️⃣ Mode-specific post-processing
    if (isUIMode) {
      // UI mode: debounce + re-render
      if (this.shouldAutoSave(run)) {
        this.debouncedSave(run);
      }
      this.updateUI(run);
    } else {
      // Programmatic mode: immediate save if needed
      if (this.shouldAutoSave(run)) {
        this.save(run);
      }
    }
    
    return true;
  }
  
  resolveAction(field, eventType) {
    if (!eventType) {
      // Programmatic mode: always write_draft
      return "write_draft";
    }
    
    // UI mode: use resolver
    return ACTION_RESOLVER[field.fieldtype]?.[eventType] || "write_draft";
  }
}
```

---

## 📊 Final Flow Comparison

### UI Event Flow:
```
User clicks "Submit" button
  ↓
handleFieldEvent(run, "_action", "submit", "onClick")
  ↓
run.input._action = "submit"
  ↓
Check permissions (with eventType context)
  ↓
Trigger workflow action
  ↓
Update doc.state
  ↓
Debounced autosave
  ↓
UI re-render
```

### Programmatic Flow:
```
Hook/API calls submit action
  ↓
handleFieldEvent(run, "submit", "submit", null)
  ↓
run.input.submit = "submit"  // or run.input._action = "submit"
  ↓
Check permissions (no event context)
  ↓
Trigger workflow action
  ↓
Update doc.state
  ↓
Immediate save (no debounce)
  ↓
No UI update

class Controller {
  // Universal event handler - handles ANY event in the system
  handleEvent(run, eventName, eventData, eventType = null) {
    const isUIMode = eventType !== null;
    
    // 1️⃣ Universal input: write event to run.input
    run.input[eventName] = eventData;
    
    // 2️⃣ Permission check
    const allowed = this.checkAllowed(run, eventName, eventType);
    if (!allowed) {
      delete run.input[eventName];
      if (isUIMode) this.showError(run, "Permission denied");
      return false;
    }
    
    // 3️⃣ Route event to appropriate handler
    if (this.isWorkflowAction(eventName)) {
      // Workflow action (buttons, programmatic actions)
      this.triggerWorkflowAction(eventData, run);
      delete run.input[eventName];  // Transient
    } else if (this.isFieldEvent(eventName)) {
      // Field update event
      this.handleFieldUpdate(run, eventName, eventData, eventType);
    } else if (this.isSystemEvent(eventName)) {
      // System events (hooks, timers, etc.)
      this.handleSystemEvent(run, eventName, eventData);
    } else {
      // Custom event
      this.handleCustomEvent(run, eventName, eventData);
    }
    
    // 4️⃣ Mode-specific post-processing
    if (isUIMode) {
      // UI mode: debounce + re-render
      if (this.shouldAutoSave(run)) {
        this.debouncedSave(run);
      }
      this.updateUI(run);
    } else {
      // Programmatic mode: immediate execution
      if (this.shouldAutoSave(run)) {
        this.save(run);
      }
    }
    
    return true;
  }
  
  // Event type checkers
  isWorkflowAction(eventName) {
    return eventName === "_action" || 
           this.workflowActions.includes(eventName) ||
           eventName.startsWith("action:");
  }
  
  isFieldEvent(eventName) {
    return eventName in run.target.schema.fields;
  }
  
  isSystemEvent(eventName) {
    return eventName.startsWith("system:") || 
           ["onLoad", "onSave", "onSubmit", "onCancel"].includes(eventName);
  }
}

// UI mode
<Input 
  onChange={(e) => 
    controller.handleEvent(run, "customer_name", e.target.value, "onChange")
  }
  onBlur={(e) => 
    controller.handleEvent(run, "customer_name", e.target.value, "onBlur")
  }
/>

// Programmatic mode
controller.handleEvent(run, "customer_name", "Acme Corp", null);

// UI mode - button click
<Button onClick={() => 
  controller.handleEvent(run, "_action", "submit", "onClick")
}>Submit</Button>

// Programmatic mode - API call
controller.handleEvent(run, "_action", "submit", null);

// Alternative: direct action name
controller.handleEvent(run, "submit", null, null);

// Framework hooks
controller.handleEvent(run, "system:onLoad", { timestamp: Date.now() }, null);
controller.handleEvent(run, "system:beforeSave", { user: currentUser }, null);
controller.handleEvent(run, "system:afterSubmit", { docname: run.doc.name }, null);

// Custom calculations
controller.handleEvent(run, "custom:calculateTotal", { tax_rate: 0.1 }, null);

// Custom integrations
controller.handleEvent(run, "custom:syncToERP", { erp_id: "ERP-001" }, null);

// Custom notifications
controller.handleEvent(run, "custom:sendApprovalEmail", { 
  approver: "john@example.com" 
}, null);

// Autosave timer
setInterval(() => {
  if (run.isDirty) {
    controller.handleEvent(run, "timer:autosave", { interval: 30000 }, null);
  }
}, 30000);

// Periodic refresh
controller.handleEvent(run, "timer:refresh", { source: "polling" }, null);

class Controller {
  handleEvent(run, eventName, eventData, eventType = null) {
    const isUIMode = eventType !== null;
    
    // Universal entry point
    run.input[eventName] = eventData;
    
    // Route to specific handler based on event pattern
    const handler = this.getEventHandler(eventName);
    if (!handler) {
      console.warn(`No handler for event: ${eventName}`);
      delete run.input[eventName];
      return false;
    }
    
    // Execute handler
    const result = handler.execute(run, eventName, eventData, eventType);
    
    // Post-processing based on mode
    this.postProcess(run, isUIMode);
    
    return result;
  }
  
  getEventHandler(eventName) {
    // Event name patterns
    if (eventName === "_action") return new WorkflowActionHandler();
    if (eventName.startsWith("action:")) return new WorkflowActionHandler();
    if (eventName.startsWith("system:")) return new SystemEventHandler();
    if (eventName.startsWith("custom:")) return new CustomEventHandler();
    if (eventName.startsWith("timer:")) return new TimerEventHandler();
    
    // Default: field event handler
    return new FieldEventHandler();
  }
  
  postProcess(run, isUIMode) {
    if (isUIMode) {
      if (this.shouldAutoSave(run)) this.debouncedSave(run);
      this.updateUI(run);
    } else {
      if (this.shouldAutoSave(run)) this.save(run);
    }
  }
}
```

---

## 📊 Complete Event Flow Diagram
```
┌─────────────────────────────────────────────┐
│            EVENT SOURCES                     │
├─────────────────────────────────────────────┤
│ • UI Events (onChange, onClick, onBlur)     │
│ • API Calls (REST, GraphQL)                 │
│ • System Hooks (onLoad, onSave)             │
│ • Custom Business Logic                      │
│ • Timers / Schedulers                        │
│ • External Integrations                      │
└──────────────────┬──────────────────────────┘
                   │
                   ▼
┌─────────────────────────────────────────────┐
│      controller.handleEvent()                │
│      (eventName, eventData, eventType)       │
└──────────────────┬──────────────────────────┘
                   │
                   ▼
┌─────────────────────────────────────────────┐
│      Write to run.input[eventName]           │
└──────────────────┬──────────────────────────┘
                   │
                   ▼
┌─────────────────────────────────────────────┐
│          Event Router                        │
│  ┌──────────────────────────────────────┐   │
│  │ Pattern Matching:                    │   │
│  │ • "_action" → Workflow               │   │
│  │ • "action:*" → Workflow              │   │
│  │ • "system:*" → System Hook           │   │
│  │ • "custom:*" → Custom Logic          │   │
│  │ • "timer:*" → Scheduled Task         │   │
│  │ • fieldname → Field Update           │   │
│  └──────────────────────────────────────┘   │
└──────────────────┬──────────────────────────┘
                   │
                   ▼
┌─────────────────────────────────────────────┐
│          Execute Event Handler               │
│  • Check permissions (workflow + guardian)   │
│  • Validate event data                       │
│  • Update document state                     │
│  • Trigger side effects                      │
└──────────────────┬──────────────────────────┘
                   │
                   ▼
┌─────────────────────────────────────────────┐
│          Mode-Specific Post-Processing       │
│  ┌──────────────────┬──────────────────┐    │
│  │   UI Mode        │  Programmatic     │    │
│  │   (eventType ≠   │  (eventType =     │    │
│  │    null)         │   null)           │    │
│  ├──────────────────┼──────────────────┤    │
│  │ • Debounced save │ • Immediate save  │    │
│  │ • UI re-render   │ • No UI update    │    │
│  │ • User feedback  │ • Return result   │    │
│  └──────────────────┴──────────────────┘    │
└─────────────────────────────────────────────┘

// ❌ Old (field-specific)
controller.handleFieldEvent(run, fieldname, value, eventType)

// ✅ New (universal event handler)
controller.handleEvent(run, eventName, eventData, eventType)

// Field events
controller.handleEvent(run, "customer_name", "Acme", "onChange");

// Workflow actions
controller.handleEvent(run, "_action", "submit", "onClick");

// System hooks
controller.handleEvent(run, "system:onLoad", {}, null);

// Custom events
controller.handleEvent(run, "custom:calculateTotal", { tax: 0.1 }, null);

// Timer events
controller.handleEvent(run, "timer:autosave", {}, null);

const MainForm = ({ run }) => {
  const [schema, setSchema] = React.useState(run?.target?.schema || null);

  const doc = run?.doc || {};
  const doctype = doc.doctype || run?.source_doctype || run?.target_doctype;

  // Load schema if missing
  React.useEffect(() => {
    if (!schema && doctype && coworker?.getSchema) {
      coworker.getSchema(doctype).then(setSchema);
    }
  }, [doctype]);

  // Guard clause
  if (!schema) {
    return React.createElement(
      "div",
      { className: CWStyles.alert.warning },
      "Loading schema..."
    );
  }

  // Safe extracts
  const titleField = schema.title_field || "name";
  const title = doc[titleField] || doc.name || "New";
  const fields = schema.fields || [];

  // Whitelist
  const implementedTypes = [
    "Data", "Text", "Long Text", "Password", "Read Only",
    "Int", "Float", "Currency", "Percent",
    "Check",
    "Date", "Datetime", "Time",
    "Select", "Link",
    "Text Editor", "Code", "HTML",
    "Section Break", "Column Break", "Tab Break",
    "Button", "Attach Image",
  ];

  // Get interaction profile
  const interactionConfig = coworker._config.fieldInteractionConfig;
  const profile = interactionConfig.profiles[interactionConfig.activeProfile];

  // Debounce timers
  const timersRef = React.useRef({});

  // ✅ Universal event emitter - NO ACTION LOGIC HERE
  const emitEvent = React.useCallback((eventName, eventData, eventType) => {
    // Get debounce config for this eventType
    const eventConfig = profile[eventType];
    
    if (!eventConfig?.enabled) {
      console.log(`⚠️ Event ${eventType} disabled by profile`);
      return;
    }

    const perform = () => {
      // ✅ Simply forward to controller - let it decide what to do
      coworker.controller.handleEvent(run, eventName, eventData, eventType);
    };

    // Handle debouncing if configured
    if (eventConfig.debounce > 0) {
      const timerKey = `${eventType}_${eventName}`;
      clearTimeout(timersRef.current[timerKey]);
      timersRef.current[timerKey] = setTimeout(perform, eventConfig.debounce);
    } else {
      perform();
    }
  }, [run, profile]);

  // ✅ Event handlers - just thin wrappers around emitEvent
  const handlers = React.useMemo(() => ({
    onChange: (fieldname, value) => {
      emitEvent(fieldname, value, "onChange");
    },

    onBlur: (fieldname, value) => {
      emitEvent(fieldname, value, "onBlur");
    },

    onClick: (eventName, eventData = null) => {
      emitEvent(eventName, eventData, "onClick");
    },

    onFocus: (fieldname, value) => {
      emitEvent(fieldname, value, "onFocus");
    },

    // Add more event types as needed
    onKeyDown: (fieldname, event) => {
      emitEvent(fieldname, event, "onKeyDown");
    },
  }), [emitEvent]);

  // Cleanup timers on unmount
  React.useEffect(() => {
    return () => {
      Object.values(timersRef.current).forEach(clearTimeout);
    };
  }, []);

  // ... rest of render logic
  
  return React.createElement(
    "div",
    { className: CWStyles.form.container },
    // Header
    React.createElement(
      "div",
      { className: CWStyles.form.header },
      React.createElement("h2", null, title)
    ),
    // Fields
    fields
      .filter(f => implementedTypes.includes(f.fieldtype))
      .map(field => 
        React.createElement(FieldComponent, {
          key: field.fieldname,
          field,
          doc,
          onChange: (value) => handlers.onChange(field.fieldname, value),
          onBlur: (value) => handlers.onBlur(field.fieldname, value),
          onClick: () => handlers.onClick(field.fieldname),
        })
      )
  );
};